<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
	<head>
		<meta http-equiv="content-type" content="text/html; charset=UTF-8" />
		<meta name="Author" content="SkyKiDS" />
		<meta name="Keywords" content="program, programming, javascript, html, xhtml, markup, stylesheet, css, application, 자바스크립트, 프로그램, 프로그래밍, 스타일시트, SkyKiDS, 스카이키즈, calculator, 계산기, brower, 브라우저, navigator, timer, clock, watch, date, day, 타이머, 시계, 스톱워치, test, 테스트, 검사, 확인, verify" />
		<meta name="Description" content="공부하는 SkyKiDS, 프로그래밍 편에서 자바스크립트로 만든 다양한 애플리케이션 및 자료를 볼 수 있습니다." />
		<title>공부하는 SkyKiDS, 프로그래밍 편</title>
		<style type="text/css">
		<!--
			img {border:0;}
		// -->
		</style>
		<style type="text/css">
		<!--
			.panel {width:608px; height:20px; text-align:right; vertical-align:bottom; padding-right:5px; padding-top:5px;}
			/*
				panel width = (number of buttons * button width : 80) + (number of blanks * blank width : 30) + { (number of buttons + number of blanks +1) * 2 }
				ex) 608 = (7 * 80) + (1 * 30) + { (7 + 1 + 1) * 2 }
			*/
			.button {width:80px; height:50px;}
			.equal {width:100%; height:50px;}
			.blank {width:30px; height:50px;}
		// -->
		</style>
		<script type="text/javascript">
		<!-- <![CDATA[
			function inputMethod(putValue, isFirst) {
				var panel = document.getElementById("panel");

				if (isFirst == true) {
					panel.value = putValue;
				}
				else {
					if (panel.value == "0") {
						if (putValue == ".") {
							panel.value += putValue;
						}
						else if (putValue == "00") {
							panel.value = "0";
						}
						else {
							panel.value = putValue;
						}
					}
					else {
						panel.value += putValue;
					}
				}
			}

			function calculation() {
				var panel = document.getElementById("panel");

				try
				{
					panel.value = eval(panel.value);
				}
				catch (e)
				{
					alert("수식이 올바르지 않습니다.");
				}
				finally
				{
				}
			}

			function calFunction(func, hasData) {
				var panel = document.getElementById("panel");

				if (hasData == false) {
					if (func == "Formula") {
						storedValue = prompt("수식을 입력하세요. 수식을 입력하기 전의 내용은 지워집니다.", 0);

						try
						{
							panel.value = eval(storedValue);
						}
						catch (e)
						{
							alert("수식이 올바르지 않습니다.");
						}
						finally
						{
						}
					}
					else if (func == "Backspace") {
						if (panel.value.length <= 1) {
							panel.value = 0;
						}
						else {
							panel.value = panel.value.substring(0, (panel.value.length -1));
						}
					}
					else {
					}
				}
				else {
					try
					{
						var storedValue = eval(panel.value);
					}
					catch (e)
					{
						alert("수식이 올바르지 않습니다.");
						return false;
					}
					finally
					{
					}

					if (func == "Int") {
						if (typeof storedValue != "number") {
							alert("숫자가 아닙니다.");
						}
						else {
							panel.value = parseInt(storedValue);
						}
					}
					else if (func == "n!") {
						if ((typeof storedValue != "number") || (storedValue % 1 != 0)) {
							alert("정수값이 아닙니다.");
						}
						else {
							for (var i = storedValue - 1; i > 0; i--) {
								storedValue = storedValue * i;
							}
							panel.value = storedValue;
						}
					}
					else {
					}
				}
			}
		// ]]> -->
		</script>
	</head>
	<body>
		<div id="wrapper">
			<h3 style="text-align:center;">공부하는 SkyKiDS, 프로그래밍 편</h3>
			<div id="googleAdsenseTop" style="text-align:center;">
				<script type="text/javascript"><!--
					google_ad_client = "pub-6916470664517841";
					//프로그래밍 편,728x90, 페이지 상단
					google_ad_slot = "4383592908";
					google_ad_width = 728;
					google_ad_height = 90;
				//--></script>
				<script type="text/javascript" src="http://pagead2.googlesyndication.com/pagead/show_ads.js"></script>
			</div>
			<div id="menu" style="margin:5px;">
				<table style="width:100%; border:1px solid black;">
					<tr>
						<td><a href="/apps/browserTest.html" title="브라우저의 속성 등을 알아볼 수 있습니다.">Test your navigator!</a></td>
						<td><a href="/apps/calculator.html" title="간단한 계산기입니다.">The calculator,</a></td>
						<td><a href="/apps/calculatorExtension.html" title="기능을 추가한 계산기입니다.">The extended calculator,</a></td>
						<td><a href="/apps/decreaseSecond.html" title="시계, 타이머, 스톱워치를 이용할 수 있습니다.">Use the Clock, Timer and Stopwatch</a></td>
					</tr>
					<tr>
						<td><a href="/apps/findKey.html" title="입력한 키를 알아보는 keyCode의 상위 버전입니다.">Check your key inputs(upgraded)!</a></td>
						<td><a href="/apps/keyCode.html" title="입력한 키를 알아볼 수 있습니다.">Check your key inputs!</a></td>
						<td><a href="/apps/readOnlyTest.html" title="입력 폼의 읽기 전용 속성을 시험할 수 있습니다.">Test the read-only property!</a></td>
						<td><a href="/apps/tagsPracticeNote.html" title="마크업 연습장입니다.">Test your markup, here!</a></td>
					</tr>
				</table>
			</div>
<!-- 
accesskeys list
0~9 : 0~9
. : .
+, -, *, / : +, -, *, /
(, ) : ( )
i : Int
r : Rand
f : n!
p : pi
o : Formula
// -->
			<div id="contents">
				<form id="calForm" action="" method="post">
				<table style="border:1px solid black; padding:5px;">
					<tr>
						<td colspan="8"><input id="panel" type="text" class="panel" value="0" readonly="readonly" /></td>
					</tr>
					<tr>
						<td><input type="button" class="button" value="7" onclick="inputMethod(this.value);" accesskey="7" /></td>
						<td><input type="button" class="button" value="8" onclick="inputMethod(this.value);" accesskey="8" /></td>
						<td><input type="button" class="button" value="9" onclick="inputMethod(this.value);" accesskey="9" /></td>
						<td><input type="button" class="button" value="+" onclick="inputMethod(this.value);" accesskey="+" /></td>
						<td class="blank"></td>
						<td><input type="button" class="button" value="Formula" onclick="calFunction(this.value, false);" accesskey="o" /></td>
						<td><input type="button" class="button" value="Backspace" onclick="calFunction(this.value, false);" accesskey="p" /></td>
						<td><input id="clear" type="reset" class="button" value="C" accesskey="c" /></td>
					</tr>
					<tr>
						<td><input type="button" class="button" value="4" onclick="inputMethod(this.value);" accesskey="4" /></td>
						<td><input type="button" class="button" value="5" onclick="inputMethod(this.value);" accesskey="5" /></td>
						<td><input type="button" class="button" value="6" onclick="inputMethod(this.value);" accesskey="6" /></td>
						<td><input type="button" class="button" value="-" onclick="inputMethod(this.value);" accesskey="-" /></td>
						<td class="blank"></td>
						<td><input type="button" class="button" value="(" onclick="inputMethod(this.value);" accesskey="(" /></td>
						<td><input type="button" class="button" value=")" onclick="inputMethod(this.value);" accesskey=")" /></td>
						<td><input type="button" class="button" value="Rand" onclick="inputMethod(Math.random(), true);" accesskey="r" /></td>
					</tr>
					<tr>
						<td><input type="button" class="button" value="1" onclick="inputMethod(this.value);" accesskey="1" /></td>
						<td><input type="button" class="button" value="2" onclick="inputMethod(this.value);" accesskey="2" /></td>
						<td><input type="button" class="button" value="3" onclick="inputMethod(this.value);" accesskey="3" /></td>
						<td><input type="button" class="button" value="*" onclick="inputMethod(this.value);" accesskey="*" /></td>
						<td class="blank"></td>
						<td><input type="button" class="button" value="Int" onclick="calFunction(this.value);" accesskey="i" /></td>
						<td><input type="button" class="button" value="n!" onclick="calFunction(this.value);" accesskey="f" /></td>
						<td><input type="button" class="button" value="pi" onclick="inputMethod(Math.PI, true);" accesskey="p" /></td>
					</tr>
					<tr>
						<td><input type="button" class="button" value="0" onclick="inputMethod(this.value);" accesskey="0" /></td>
						<td><input type="button" class="button" value="00" onclick="inputMethod(this.value);" /></td>
						<td><input type="button" class="button" value="." onclick="inputMethod(this.value);" accesskey="." /></td>
						<td><input type="button" class="button" value="/" onclick="inputMethod(this.value);" accesskey="/" /></td>
						<td class="blank"></td>
						<td colspan="4"><input id="equal" type="button" class="equal" value="=" onclick="calculation();" accesskey="=" /></td>
					</tr>
				</table>
				</form>
			</div>
			<p><a href="http://validator.w3.org/check?uri=referer"><img src="http://www.w3.org/Icons/valid-xhtml10" alt="Valid XHTML 1.0 Strict" height="31" width="88" /></a></p>
		</div>
	</body>
</html>
